<template>
  <div class="login" box-border w-full h-full flex justify-between>
    <div class="login-box">
      <div flex-1>
        <img w-full object-cover src="@/assets/images/login_left.png" />
      </div>
      <LoginForm />
    </div>
  </div>
</template>

<script setup lang="ts">
import LoginForm from "./components/LoginForm.vue";
</script>
<style scoped lang="scss">
.login {
  background-color: #f8f8f8;
  background-image: url("@/assets/images/login_bg.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  .login-box {
    margin: auto;
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 0 20px;
    width: 96%;
    height: 95%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
  }
}
</style>
